import QtQuick 2.15
import QtQuick.Controls 2.15
import '../component'
ApplicationWindow {
	width: 800; height: 700
	visible: true
	
	
	DarkSquare {
		width: 120
		height: column.implicitHeight + 8 // 加上文本和间距的高度
		
		Column {
			id: column
			anchors {
				horizontalCenter: parent.horizontalCenter
				top: parent.top
				topMargin: 8 // 调整顶部边距
			}
			spacing: 8
			
			RedSquare {}
			GreenSquare { width: 96 }
			BlueSquare {}
		}
	}

	BrightSquare{
		y:190
		width:row.width
		height:120

		Row{
			id:row
			anchors.fill:parent
			spacing:20
			BlueSquare { }
			GreenSquare { }
			RedSquare { }
		}
	}
	
	BrightSquare{
		y:320
		width:120
		height:120
		Grid{
			rows:2
			columns:2
			id:grid
			anchors.fill:parent
			spacing:8
			RedSquare { }
			RedSquare { }
			RedSquare { }
			RedSquare { }
		}
	}
	
	BrightSquare{
		y:420
		width: 300
		height: 120
		Flow{
			anchors.margins: 20
			anchors.fill:parent
			spacing:20
			RedSquare { }
			BlueSquare { }
			GreenSquare { }
			RedSquare { }
		}
	}
	
	BrightSquare{
		id: example1
		y: 600
		width: row1.childrenRect.width*2 + 2*margins
		height: row1.childrenRect.height*2 + 2*margins
		property int margins:20
		
		Row{
			id: row1
			anchors.fill:parent
			anchors.margins: example1.margins
			spacing: example1.margins/2
			BlueSquare { }
			GreenSquare { }
			RedSquare { }
		}
	}
}